@charset "gb2312";
.examples_body {width:1000px;margin: 10px auto 0 auto;clear: both;position: relative;}
		.bx_wrap { margin-left:0px; padding-left:0px;  }
		.bx_wrap ul img { margin-left:0px; padding-left:0px; width:125px; height:60px  }
		.bx_wrap ul{ margin-left:0px; padding-left:0px;}
		.bx_wrap ul li{ margin-left:0px; padding-left:0px; cursor:pointer; font-size:12px;width:125px; overflow:hidden; text-align:center; line-height:18px;}
		
		
 .img-scroll { position:relative; width:875px }
    .img-scroll .prev,.img-scroll .next { position:absolute; display:block; width:33px; height:35px; top:0; color:#FFF; text-align:center; }
    .img-scroll .prev { left:0}
    .img-scroll .next { right:0}
    .img-list { position:relative; width:820px; height:35px;  overflow:hidden; margin:0   20px}
    .img-list ul { width:9999px;}
    .img-list li { float:left; display:inline; text-align:center; line-height:35px;}
	
	
	 .img-scroll2 { position:relative; width:750px }
    .img-scroll2 .prev2,.img-scroll .next2 { position:absolute; display:block; width:33px ; height:35px; top:0; color:#FFF; text-align:center; }
	.img-scroll2 .prev2 img{width:33px !important ; height:35px ;}
	.img-scroll2 .prev2 img{width:33px !important ; height:35px ;}
    .img-scroll2 .prev2 { left:0}
    .img-scroll2 .next2 { left:0}
    .img-list2 { position:relative; width:750px; overflow:hidden; margin:0   20px 0 40px; float:left}
    .img-list2 ul { width:9999px;}
    .img-list2 li { float:left; display:inline; text-align:center; line-height:35px; margin:0 4px}

		
.container {position: relative; z-index:100}
.container:after {content: "";display: block;clear: both;height: 0;}
.menu {position: relative;float: left;width: 100%;padding: 0 20px;}
.menu, .menu ul {list-style: none;}
.menu > li {float: left;position: relative;perspective: 1000px;}
.menu > li:first-child {}
.menu li li{float:left;}
.menu li .bit{ background:url(../images/jt.png) no-repeat center right; position:relative; z-index:-10000000000000000000000000000 !important  }
.menu .bit{display: block;float:left;float:left;position: relative;z-index: 30;padding: 13px 30px 13px 20px;text-decoration: none;color:#4484b2 ;line-height: 1;font-size: 12px;letter-spacing: -.05em;background: transparent;		text-shadow: 0 1px 1px rgba(255,255,255,.9);transition: all .25s ease-in-out}
.menu .bit a{color:#4484b2 ;}
.menu .bit a:hover{color:#fff !important ;}
.menu > li:hover > .bit{color:#fff !important;text-shadow: none; background:url(../images/jts.png) no-repeat right center #4484b2;border-top-left-radius: 4px;
	border-top-right-radius: 4px;}
	.menu > li:hover > .bit a{color:#fff !important ;}
.menu li ul  {
	position: absolute;
	top:35px;
	left: 0;
	z-index: 20;
	width: 250px;
	padding: 0;
	opacity: 0;
	visibility: hidden;
	border-bottom-left-radius: 5px;
	border-bottom-right-radius: 5px;
	background: transparent;
	overflow: hidden;
	transform-origin: 50% 0%;
}

.menu li:hover ul {

	padding: 0 0;
	background: #4484b2;
	opacity: 1;
	visibility: visible;
	box-shadow: 1px 1px 7px rgba(0,0,0,.5);
	animation-name: swingdown;
	animation-duration: 1s;
	animation-timing-function: ease; 
}

@keyframes swingdown {
	0% {
		opacity: .99999;
		transform: rotateX(90deg);
	}

	30% {			
		transform: rotateX(-20deg) rotateY(5deg);
		animation-timing-function: ease-in-out;
	}

	65% {
		transform: rotateX(20deg) rotateY(-3deg);
		animation-timing-function: ease-in-out;
	}

	100% {
		transform: rotateX(0);
		animation-timing-function: ease-in-out;
	}
}

.menu li li a {
	 padding:12px 10px;
	font-weight: 400;
	color: #ddd;
	text-shadow: none;
	border-top: dotted 1px transparent;
	border-bottom: dotted 1px transparent;
	transition: all .15s linear; min-width:50px;
}

.menu li li a:hover {
	color:#00dffc;
	border-top: dotted 1px rgba(255,255,255,.15);
	border-bottom: dotted 1px rgba(255,255,255,.15);
	background: rgba(0,223,252,.02);
}